<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>登录页面</title>
</head>

<body>
<h2>登录</h2>
<form id="loginForm">
    <label for="username">用户名：</label>
    <input type="text" id="username" name="username" required><br><br>

    <label for="password">密码：</label>
    <input type="password" id="password" name="password" required><br><br>

    <button type="submit">登录</button>
</form>

<script>
    document.getElementById('loginForm').addEventListener('submit', function(event) {
        event.preventDefault();

        var username = document.getElementById('username').value;
        var password = document.getElementById('password').value;

        // 发送登录请求到后端
        fetch('/LoginController/login', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({ userName: username, password: password })
        })
            .then(response => response.json())
            .then(data => {
                if (data.token) {
                    // 存储 JWT 到本地存储或 Cookie
                    localStorage.setItem('token', data.token);

                    // 跳转到成功页面
                    window.location.href ='/';

                } else {
                    alert('登录失败，请检查用户名和密码。');
                }
            })
            .catch(error => console.error('错误:', error));
    });
</script>
</body>

</html>